<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>录入页</title>
    <link rel="stylesheet" href="../css/bootstrap.css" />
    <style>
        .modal-open {
            overflow: auto;
            margin-bottom: 60px;
        }
    </style>
</head>

<body>
    <template id='login'>
			<div class="signIn container" style="text-align: center;margin-top: 200px;">
				<h2>管理员登录</h2>
				<div class="input-group input-group-lg" style="margin-top: 30px;">
					<span class="input-group-addon" id="sizing-addon1">@</span>
					<input type="text" class="form-control" placeholder="Username" aria-describedby="sizing-addon1" id="userName" v-model="user">
				</div>
				<div class="input-group input-group-lg" style="margin-top: 30px;">
					<span class="input-group-addon" id="sizing-addon1">@</span>
					<input type="text" class="form-control" placeholder="password" aria-describedby="sizing-addon1" id="passWord" v-model="pwd">
				</div>
				<div class="mybtn" style="margin-top: 40px;">
					<router-link :to='{path:"/addData",query:{"admin":user}}'>
						<button class="btn btn-primary col-sm-12  btn-lg" data-toggle="modal" data-target="#signIn" id="signInBtn">登录</button>
					</router-link>
					<button class="btn btn-default col-sm-12  btn-lg" data-toggle="modal" data-target="" disabled="false" style="margin-top:20px;">注册(暂未开放)</button>
				</div>

				<!--管理员登录模态框-->
				<div class="modal fade" id="signIn" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
								<h4 class="modal-title" id="myModalLabel">账号或密码不正确，请重新输入</h4>
							</div>

							<div class="modal-footer">
								<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

							</div>
						</div>
					</div>
				</div>

			</div>
		</template>
    <template id="addData">

			<div class="container">
				<div class="admin col-12" style="height:100px;display:flex;justify-content:space-between;padding:0 10px;">
					<div>
						<b style="line-height: 100px;font-size: 16px;">你好：{{admin}}</b>
					</div>
					<router-link :to='{path:"/list",query:{"admin":admin}}'><b style="font-size:16px;line-height: 100px;">电影列表</b></router-link>
				</div>

				<div class="form-group">

					<h1 class="col-sm-12 text-center">51Look电影网后台录入页</h1>

				</div>
				<form class="form-horizontal" onsubmit="return false" id="_form">
					<div class="form-group">
						<div style="height:50px;width:100%"></div>
						<div style="height:1px;background: #8C8C8C;" class="col-sm-11 col-sm-offset-1"></div>
						<div style="height:50px;width:100%"></div>
					</div>
					<div class="form-group" v-for="(item,index) in data">
						<label for="inputEmail3" class="col-sm-2 control-label">{{item.name}} ：</label>
						<div class="col-sm-10">
							<input type="text" class="form-control" :id='item._id' :name='item._id' :placeholder="item._id" @focus.once="demo(item._id)">
						</div>
					</div>
					<div class="form-group">
						<label for="inputPassword3" class="col-sm-2 control-label">简介 ：</label>
						<div class="col-sm-10">
							<textarea class="form-control" rows="3" id="content"></textarea>
						</div>
					</div>

					<input type="hidden" name="flag" id="flag" value="" placeholder="flag" />
					<input type="hidden" name="admin" id="admin" v-model="admin" placeholder="admin" />
					<button id="addMovie" class="btn btn-info col-sm-10 col-sm-offset-2" data-toggle="modal" data-target="#add" @click="btnclick">添加</button>
				</form>

				<!--录入信息模态框-->
				<div class="modal fade" id="add" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
								<h4 class="modal-title" id="myModalLabel"> </h4>
							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

							</div>
						</div>
					</div>
				</div>

			</div>
		</template>
    <template id="AVlist">
		<div class="container">
				<div class="admin col-12" style="height:100px;display:flex;justify-content:space-between;padding:0 10px;">
					<div>
						<b style="font-size:16px;line-height: 100px;">你好:{{admin}}</b>
					</div>
					<router-link :to='{path:"/addData",query:{"admin":admin}}'><b style="font-size:16px;line-height: 100px;">录入页</b></router-link>
				</div>
				<div class="form-group">
					<h1 class="col-sm-12 text-center">51Look电影网后台列表</h1>
				</div>
				<table class="table table-striped table-hover text-center">
					<tr>
						<th class=" text-center">名称</th>
						<th class=" text-center" >上映</th>
						<th class=" text-center">导演</th>
						<th class=" text-center" >主演</th>
						<th class=" text-center">类型</th>
						<th class=" text-center">录入时间</th>
						<th class=" text-center">录入人员</th>
                        <th class=" text-center">管理</th>
					</tr>
					<tr v-for="(item,index) in av" class="delList">
						<td >{{item.name}}</td>
						<td>{{item.year}}</td>
						<td>{{item.director}}</td>
						<td>{{item.star}}</td>
						<td>{{item.types}}</td>
						<td>{{item.createTime}}</td>
						<td>{{item.admin}}</td>
                        <td style="width:120px">
                            <button class="btn btn-primary btn-sm" @click = "revise(index)" >修改</button>
                            <button class="btn btn-danger btn-sm" data-toggle="modal" data-target="#del"   @click = "delBtn(index)">删除</button>
                        </td>
					</tr>
				</table>
                <div class="modal fade" id="del" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                <h4 class="modal-title" id="myModalLabel">确认要删除吗？录入很辛苦的！</h4>
							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-danger" data-dismiss="modal" @click = "delAjax">朕意已决</button>
                                <button type="button" class="btn btn-primary" data-dismiss="modal">容朕再想想</button>
							</div>
						</div>
					</div>
				</div>
             </div>
	</template>
    <!--内容区域-->

    <div id="app">
        <router-view></router-view>
    </div>
    <script src="../js/vue.js"></script>
    <script src="../js/vue-router.min.js"></script>
    <script src="../js/jquery-3.1.1.min.js"></script>
    <script src="../js/bootstrap.min.js"></script>
	<script src="../js/admin.js"></script>
</body>

</html>